<template>
	<a-row class="news_list">
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/01.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/02.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/03.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/04.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/01.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/02.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/03.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/04.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/01.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/02.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/03.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/04.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/01.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/02.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/03.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/04.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/05.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/02.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/07.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
		<a-col :span="6">
			<div class="thumbnail">
				<a href="#">
					<img src="../assets/images/06.png" />
				</a>
				<div class="caption">
					<h3>
						<a href="#" title="Bootstrap 优站精选" target="_blank">优站精选<br /><small> Bootstrap 网站实例</small></a>
					</h3>
					<p>
						Bootstrap 优站精选频道收集了众多基于 Bootstrap
						构建、设计精美的、有创意的网站。
					</p>
				</div>
			</div>
		</a-col>
	</a-row>
</template>

<script lang="ts">
	import { defineComponent } from "vue";

	export default defineComponent({
		data() {
			return {};
		},
	});
</script>

<style lang="scss">
	.news_list {
		.ant-col {
			padding: 10px;

			.thumbnail {
				border: 1px solid #eee;
				padding: 5px;

				img {
					height: 150px;
					width: 100%;
				}

				h3 {
					font-size: 20px;
					text-align: center;
				}

				p {
					text-align: center;
				}
			}
		}
	}
</style>